﻿<%@ Page Title="" Language="C#" MasterPageFile="~/home-loan/Home_Loan.master" AutoEventWireup="true" CodeFile="mortgage-calculator.aspx.cs" 
Inherits="home_loan_mortgage_calculator" %>

<%@ Register Src="../controls/usrCompanyBigLogoByServices.ascx" TagName="usrCompanyBigLogoByServices"
    TagPrefix="uc4" %>
<%@ Register Src="~/controls/usrNoJS.ascx" TagName="usrNoJS" TagPrefix="ucNoJS" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">

    <script src="../controls/CE_Date.js" type="text/javascript"></script>

    <script src="../includes/ValidationError.js" type="text/javascript"></script>

    <script src="../includes/ValidationEffect.js" type="text/javascript"></script>

    <script src="../includes/LoadingProgress.js" type="text/javascript"></script>

    <div class="elements_inner_wrapper">
        <ucNoJS:usrNoJS ID="usrNoJS1" runat="server" />
        <!-- #Include file="../includes/body_loader.inc" -->

        <script type="text/javascript">
            IncreaseProgress(5);
        </script>

        <div id="divContent" style="display: none">
            <div class="rightcol">
                <div class="content_right">
                    <div class="tip">
                        <div class="head"></div>
                        <div class="body" id="spanPartnerLogo">
                            <h1>Our Merchants</h1>
                            <uc4:usrCompanyBigLogoByServices LogoLimitCount="8" CompanyProviderTypeId="200" ID="usrCompanyLogoByServices1"
                                runat="server" />
                        </div>
                        <div class="foot"></div>
                    </div>
                    <br />
                    <div class="tip">
                        <div class="head">
                        </div>
                        <div class="body">
                            <h1>Home Loans Calculators</h1>
                            <div class="pad_10">
                                <p>Work out how much you can borrow and how much it will cost?</p>
                                <ul>
                                    <li class="calc"><a href="#">Refinancing Calculator</a></li>
                                    <li class="calc"><a href="#">How much can I borrow?</a></li>
                                </ul>
                            </div>
                        </div>
                        <div class="foot">
                        </div>
                    </div>
                </div>
            </div>
            <div id="contentBody">
            <h1>Mortgage Payment Calculator</h1>
                <div class="seperator">
                </div>
                <div class="section">
                    <fieldset>
                        <div class="row">
                            <asp:ValidationSummary ID="ValidationSummary1" HeaderText="Oops Please complete the form."
                                runat="server" ValidationGroup="homeloan" CssClass="errorSummary" />
                        </div>
                        
                        <script type="text/javascript">
                            IncreaseProgress(25);
                        </script>
                        
                        <div class="row">
                            <label for="Loan Amount" class="mand_red">
                                Loan Amount
                            </label>
                            <div class="field">
                                <span class="indicator">S$ &nbsp;</span> <span class="indicator">
                                    <asp:TextBox ID="txtLoanAmount" runat="server" class="text" Width="171"></asp:TextBox></span>
                                <span class="indicator">
                                    <asp:RequiredFieldValidator ID="rfvLoanAmount" runat="server" ControlToValidate="txtLoanAmount"
                                        Display="Dynamic" validationErrorCssClass="validationError" ErrorMessage="" ValidationGroup="homeloan"></asp:RequiredFieldValidator>
                                    <asp:RegularExpressionValidator ID="revLoanAmount" runat="server" ControlToValidate="txtLoanAmount"
                                        validationErrorCssClass="validationError"  ErrorMessage="" ValidationGroup="homeloan" 
                                        ValidationExpression="^[0-9]+(\.[0-9]{1,2})?$"></asp:RegularExpressionValidator>
                                </span>
                            </div>
                            <div class="clear">
                            </div>
                        </div>
                        <script type="text/javascript">
                            IncreaseProgress(45);
                        </script>
                        <div class="row">
                            <label for="IntrestRate" class="mand_red">
                                Intrest Rate
                            </label>
                            <div class="field">
                                <span class="indicator">
                                    <asp:TextBox ID="txtIntrestRate" runat="server" class="text" Width="80"></asp:TextBox></span>
                                <span class="indicator">
                                    <asp:RequiredFieldValidator ID="rfvIntrestRate" runat="server" ControlToValidate="txtIntrestRate"
                                        Display="Dynamic" validationErrorCssClass="validationError" ErrorMessage="" ValidationGroup="homeloan"></asp:RequiredFieldValidator>
                                    <asp:RegularExpressionValidator ID="revIntrestRate" runat="server" ControlToValidate="txtIntrestRate"
                                        validationErrorCssClass="validationError"  ErrorMessage="" ValidationGroup="homeloan" 
                                        ValidationExpression="^[0-9]+(\.[0-9]{1,2})?$"></asp:RegularExpressionValidator>
                                </span>
                            </div>
                            <div class="clear">
                            </div>
                        </div>
                        
                        <div class="row">
                            <label for="LoanDuration" class="mand_red">
                                Loan Duration
                            </label>
                            <div class="field">
                                <span class="indicator">
                                    <asp:TextBox ID="txtLoanTenure" runat="server" class="text" Width="80" MaxLength="2"></asp:TextBox></span>
                                <span class="indicator">
                                    <asp:RequiredFieldValidator ID="rfvLoanTenure" runat="server" ControlToValidate="txtLoanTenure"
                                        Display="Dynamic" validationErrorCssClass="validationError" ErrorMessage="" ValidationGroup="homeloan"></asp:RequiredFieldValidator>
                                    <asp:RegularExpressionValidator ID="revLoanTenure" runat="server" ControlToValidate="txtLoanTenure"
                                        validationErrorCssClass="validationError"  ErrorMessage="" ValidationGroup="homeloan" 
                                        ValidationExpression="^[0-9]+(\[0-9])?$"></asp:RegularExpressionValidator>
                                </span>
                            </div>
                            <div class="clear">
                            </div>
                        </div>
                        <%--<div class="row">
                            <label for="LoanTenure" class="mand_red">
                                Loan Duration</label>
                            <div class="field">
                                <span class="indicator">
                                    <asp:DropDownList ID="ddlLoanTenure" runat="server" class="text" Width="200"></asp:DropDownList>
                                </span><span class="indicator">
                                    <asp:RequiredFieldValidator ID="rfvLoanTenure" InitialValue="-1" runat="server" ControlToValidate="ddlLoanTenure"
                                        validationErrorCssClass="validationError" ErrorMessage="" ValidationGroup="homeloan"></asp:RequiredFieldValidator>
                                </span>
                            </div>
                            <div class="clear">
                            </div>
                        </div>--%>
                        <script type="text/javascript">
                            IncreaseProgress(80);
                        </script>
                    </fieldset>
                    <div class="formButtons">
                        <div class="mid_align">
                            <asp:ImageButton ID="ImageButton1" OnClientClick="LoadValidationErrorCss();" runat="server"
                                ImageUrl="~/images/buttons/submit_but.gif" OnClick="ImageButton1_Click" ValidationGroup="homeloan"
                                class="img_align_right" onmouseover="this.src='/images/buttons/submit_but_o.gif';"
                                onmouseout="this.src='/images/buttons/submit_but.gif';" />
                            <asp:Label runat="server" ID="lblError" ForeColor="Red"></asp:Label>
                        </div>
                    </div>
                    <div class="seperator"></div>
                    <div id="divResult" runat="server" visible="false">
                        <div class="row cal_result">
                            <h2>Result</h2>
                            <%--<label for="LoanTenure" class="mand_red"></label>
                            <asp:Label runat="server" ID="lblResult" ></asp:Label>
                            <div class="clear"></div>--%>
                                                        
                            <div class="row">
                                <label for="LoanDuration">
                                    Monthly Payment
                                </label>
                                <div class="field">
                                    <span class="indicator">
                                        <asp:Label runat="server" ID="lblMonthlyPayment" ></asp:Label></span>
                                </div>
                                <div class="clear">
                                </div>
                            </div> 
                            <div class="row">
                                <label for="LoanDuration">
                                    Loan Amount
                                </label>
                                <div class="field">
                                    <span class="indicator">
                                        <asp:Label runat="server" ID="lblLoanAmount" ></asp:Label></span>
                                </div>
                                <div class="clear">
                                </div>
                            </div> 
                            <div class="row">
                                <label for="LoanDuration">
                                    Intrest Rate
                                </label>
                                <div class="field">
                                    <span class="indicator">
                                        <asp:Label runat="server" ID="lblIntrestRate" ></asp:Label></span>
                                </div>
                                <div class="clear">
                                </div>
                            </div>
                            <div class="row">
                                <label for="LoanDuration">
                                    Loan Duration
                                </label>
                                <div class="field">
                                    <span class="indicator">
                                        <asp:Label runat="server" ID="lblLoanDuration" ></asp:Label></span>
                                </div>
                                <div class="clear">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="clear">
                    </div>

                <!--------------CONTENT HERE -------------->
            </div>
        </div>
    </div>

    <script type="text/javascript">
        //<![CDATA[

        function principal_calc() {

            /*var principal = document.principal.p.value;
            var interest = document.principal.i.value;
            var noy = document.principal.noy.value;

            if (principal == '') { principal = '0'; }
            if (interest == '') { interest = '0'; }
            if (noy == '') { noy = '0'; }

            if (principal == "0") {
                var display = 'Please fill "Loan Amount" field.';
                document.getElementById("status").innerHTML = display;
            }

            if (interest == "0") {
                var display = 'Please fill "Interest Rate" field.';
                document.getElementById("status").innerHTML = display;
            }

            if (noy == "0") {
                var display = 'Please fill "Length of Loan" field.';
                document.getElementById("status").innerHTML = display;
            }

            if (principal != "0" && interest != "0" && noy != "0") {
                var str = principal
                var a = (str.replace(/,/, ""))
                var t_years = eval(noy * 12)
                var t_interest = eval(interest / 1200);
                var t = eval(1.0 / (Math.pow((1 + t_interest), t_years)));

                if (t < 1) {
                    var payment = eval((a * t_interest) / (1 - t));
                } else {
                    var payment = eval(amt / $t_years);
                }

                var total = payment.toFixed(2);
                var display = 'Your <span  style=\"font-weight: bold; color: #339900;\">Monthly Payment</span> for <span style=\"font-weight: bold; color: #155776;\">' + noy + '</span> <span style=\"font-weight: bold; color: #339900;\">Years</span> at an <span style=\"font-weight: bold; color: #339900;\">Interest Rate</span> of <span style=\"font-weight: bold; color: #155776;\">' + interest + '%</span> for a <span style=\"font-weight: bold; color: #339900;\">Loan Amount</span> of <span style=\"font-weight: bold; color: #155776;\">$' + principal + '</span> is <span style=\"font-weight: bold; color: #155776;\">$' + total + '</span> a <span style=\"font-weight: bold; color: #339900;\">Month</span>.';

                document.getElementById("status").innerHTML = display;

            } */

        }

        //]]> 
    </script>

    <script type="text/javascript">
        IncreaseProgress(100);
        HideLoading();
    </script>

</asp:Content>

